import React, { PureComponent } from 'react';
import { Icon } from 'antd';
import Link from 'umi/link';
import Debounce from 'lodash-decorators/debounce';
import styles from './index.less';
import RightContent from './RightContent';
import moment from 'moment';

export default class GlobalHeader extends PureComponent {
  state = {
    year: '',
    month: '',
    day: '',
    time: '',
    week: '',
  };
  componentDidMount() {
    this.dispatchData();
    this.getWeek();
    this.timer = setInterval(() => {
      this.dispatchData();
    }, 60000);
  }
  getWeek = () => {
    let week_index = moment().format('e');
    if (week_index === '1') {
      this.setState({ week: '星期一' });
    } else if (week_index === '2') {
      this.setState({ week: '星期二' });
    } else if (week_index === '3') {
      this.setState({ week: '星期三' });
    } else if (week_index === '4') {
      this.setState({ week: '星期四' });
    } else if (week_index === '5') {
      this.setState({ week: '星期五' });
    } else if (week_index === '6') {
      this.setState({ week: '星期六' });
    } else {
      this.setState({ week: '星期日' });
    }
  };
  dispatchData = () => {
    let year = moment().format('YYYY');
    let month = moment().format('MM');
    let day = moment().format('DD');
    let time = moment().format('HH:mm');

    this.setState({ year, day, month, time });
  };

  componentWillUnmount() {
    this.timer && clearInterval(this.timer);
    this.timer = false;
    this.triggerResizeEvent.cancel();
  }
  /* eslint-disable*/
  @Debounce(600)
  triggerResizeEvent() {
    // eslint-disable-line
    const event = document.createEvent('HTMLEvents');
    event.initEvent('resize', true, false);
    window.dispatchEvent(event);
  }
  render() {
    const { year, day, month, time, week } = this.state;
    const { isMobile, logo } = this.props;
    return (
      <div className={styles.header}>
        {/*{isMobile && (*/}
          {/*<Link to="/" className={styles.logo} key="logo">*/}
            {/*<img src={logo} alt="logo" width="32" />*/}
          {/*</Link>*/}
        {/*)}*/}
        {/*<div className={styles.img}>*/}
          {/*<img src={require('../../assets/logo.png')} alt="" />*/}
        {/*</div>*/}
        {/*<div className={styles.date}>*/}
          {/*<i style={{ marginRight: 10 }}>{week}</i>*/}
          {/*<i>*/}
            {/*{year}年{month}月{day}日*/}
          {/*</i>*/}
          {/*<i>{time}</i>*/}
        {/*</div>*/}
        {/*<RightContent {...this.props} />*/}
      </div>
    );
  }
}
